<template>
  <el-select
    :value="value"
    placeholder="请选择"
    @change="changeChannel"
    clearable
  >
    <el-option
      v-for="item in channelOptions"
      :key="item.id"
      :label="item.name"
      :value="item.id"
    >
    </el-option>
  </el-select>
</template>

<script>
export default {
  name: 'myChannel',
  props: ['value'],
  data () {
    return {
      channelId: null,
      channelOptions: []
    }
  },
  created () {
    this.getChannelOptions()
  },
  methods: {
    // 获取文章频道
    async getChannelOptions () {
      //   解构        原始写法 res.data.data.channels
      const { data: { data } } = await this.$axios.get('/mp/v1_0/channels')
      // console.log(data.channels);
      this.channelOptions = data.channels
    },
    // 清空频道,防止频道清空报错
    changeChannel (changeDataId) {
      // console.log(changeDataId);
      if (changeDataId === '') changeDataId = null
      // 子传父
      this.$emit('input', changeDataId)
    }
  }
}
</script>

<style>
</style>
